import React,{FC} from 'react';
import {useDispatch} from 'react-redux';
import {bindActionCreators} from 'redux';
import * as imgActions from '../../../store/actions/img.action';

interface Iprops{
    url:string,
    showSwiperDialog?:(ImageID:number) => void;
    ImageID:number;
    index:number;
}

const BlockImage:FC<Iprops> = ({url,showSwiperDialog,ImageID,index}) => {

    const dispatch = useDispatch();

    const {setActiveIndex} = bindActionCreators(imgActions,dispatch);

    console.log(setActiveIndex);
    
    return <div onClick={() => {
        //设置activeIndex
        setActiveIndex(index);
        (showSwiperDialog as (ImageID:number) => void)(ImageID)}
    }>
        <img src={url.replace('{0}','3')} alt=""/>
    </div>   
}

export default BlockImage